<template>
	<view>

		<view class="view-biankuang" @click="saoma"> 扫描设备码打卡 </view>
		<view class="view-biankuang5" @click="inputClock"> 输入名牌编号打卡 </view>
		<!-- <view class="view-biankuang1" @click="daka"> 签到 </view> -->
		<view class="list_top_title" style="text-align: center;">
			<text class="red">*</text>
			<text class="list_top_font">
				今日签到次数:{{cishu}}
			</text>
		</view>
		<view class="list_top_title" style="text-align: center;">
			<text class="red">*</text>
			<text class="list_top_font">
				最近一次打卡时间:{{shijian}}
			</text>
		</view>
		<!-- <view class="view-biankuang2" @click="cardReplacement"> 补卡记录 </view>
		<view class="list_top_title" style="text-align: center;">
			<text class="red">*</text>
			<text class="list_top_font">
				补卡请至该工单下提交申请
			</text>
		</view>
		<view class="list_top_title" style="text-align: center;">
			<text class="red">*</text>
			<text class="list_top_font">
				（每月两次补卡机会）
			</text>
		</view> -->
		<u-gap height="40px"></u-gap>

		<userTab selectedIndex=1></userTab>
	</view>
</template>

<script>
	import amap from '@/static/js/amap-wx.130.js';
	export default {
		data() {
			return {

				ama: [],
				amapPlugin: null,
				gaodekey: '2d6b6ba0a141c6befeb128bff2bbfbe2', //高德key,此处的key需要去高德平台申请获取，此key是假的！！！
				address: "", // 已经获取到的位置
				userList: [],
				onlyFromCamera: true,
				shijian: "",
				cishu: '',
				date: new Date().toISOString(),
			}
		},
		mounted() {
			let _this = this;
			setInterval(function() {
				_this.date = Date.parse(new Date());
			}, 1000);
		},
		onLoad() {
			uni.$on('workOrderNumberMsg', (data) => {
				//我把传过来的数据存到了 data 中
				this.userList = data
				//    this.userName = data.data[1]
				// console.log('接收数据',data);
			})
			uni.$emit('send')
			// 坐标获取
			// this.amapPlugin = new amap.AMapWX({
			// 	key: this.gaodekey
			// });
			this.getLocation()

			uni.request({
				url: "https://www.smacaftersales.com:443/punchRecord/punchRecord/checkInTodaysClockIn",
				method: "POST",
				data: {
					userid: this.userList.userId,
					clockdate: this.dateFormat1(this.date)
				},
				header: {
					// "Content-type": "application/x-www-form-urlencoded",
					"Content-type": "application/json",
					// "Content-type": "multipart/form-data"
					// "Content-type": "text/xml"
				},
				success: (res) => {
					let b = res.data.data[0]
					if (res.data.data.length == 1) {
						this.cishu = "暂无"
						this.shijian = "暂无"
					} else {
						const a = JSON.parse(res.data.data[1])
						this.cishu = b
						this.shijian = a.clockdate + "  " + a.clocktime
					}
				},
			});
		},
		methods: {
			//获取当前时间
			dateFormat(time) {
				let date = new Date(time);
				let year = date.getFullYear();
				// 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
				let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
				let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
				let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
				let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
				let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
				// 拼接
				return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
				// return year + "-" + month + "-" + day;
			},
			dateFormat1(time) {
				let date = new Date(time);
				let year = date.getFullYear();
				// 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
				let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
				let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
				let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
				let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
				let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
				// 拼接
				return year + "-" + month + "-" + day;
				// return year + "-" + month + "-" + day;
			},
			dateFormat2(time) {
				let date = new Date(time);
				let year = date.getFullYear();
				// 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
				let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
				let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
				let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
				let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
				let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
				// 拼接
				return hours + ":" + minutes + ":" + seconds;
				// return year + "-" + month + "-" + day;
			},
			saoma() {
				// 坐标获取
				// console.log("---------------------------------")
				// console.log(this.getLocation());
				// this.getLocation().
				// console.log(this.ama)
				uni.scanCode({
					scanType: ["qrCode"],
					success: (res) => {
						// console.log(res);
						if (res.result) {
							const val = res.result;
							console.log(val, "=========")
							if (val.includes("SMAC")) {
								console.log(this.ama[0].name)

								uni.request({
									url: "https://www.smacaftersales.com:443/punchRecord/punchRecord/afterSalesCheckIn",
									// url: "http://localhost:8080/punchRecord/punchRecord/afterSalesCheckIn",
									method: "POST",
									data: {
										userid: this.userList.userId,
										deviceid: val,
										position: this.ama[0].name + this.ama[0].desc,
										lat: this.ama[0].latitude,
										lng: this.ama[0].longitude,
										clockdate: this.dateFormat1(this.date),
										clocktime: this.dateFormat2(this.date),
									},
									header: {
										// "Content-type": "application/x-www-form-urlencoded",
										"Content-type": "application/json",
										// "Content-type": "multipart/form-data"
										// "Content-type": "text/xml"
									},
									success: (res) => {
										console.log(res, "===========");
										if (res.data.data == 1) {
											setTimeout(function() {
												// 页面重载
												const pages = getCurrentPages()
												// 声明一个pages使用getCurrentPages方法
												const curPage = pages[pages.length - 1]
												// 声明一个当前页面
												curPage.onLoad(curPage.options) // 传入参数
												curPage.onShow()
												curPage.onReady()
												// 执行刷新
											}, 2000);

											uni.showToast({
												title: '打卡成功',
												icon: 'success', //如果要纯文本，不要icon，将值设为'none'
												duration: 2000, //持续时间为 2秒
												mask: false,
											})
										} else {
											uni.showToast({
												title: '打卡失败',
												icon: 'error', //如果要纯文本，不要icon，将值设为'none'
												duration: 2000, //持续时间为 2秒
												mask: false,
											})
										}
									},
								});
							} else {
								uni.showToast({
									title: '扫描不是机器二维码',
									icon: 'success', //如果要纯文本，不要icon，将值设为'none'
									duration: 2000, //持续时间为 2秒
									mask: false,
								})
							}
							// uni.navigateTo({																	
							// 	url: '/pages/deviceInformation/deviceInformation'
							// });
						} else {

							// console.log('请重新扫描');
							return false;
							uni.showToast({
								title: '请重新扫描',
								icon: 'none', //如果要纯文本，不要icon，将值设为'none'
								duration: 2000, //持续时间为 2秒
								mask: false,
							})
						}
					},
					fail: (res) => {
						// console.log('未识别到二维码');
						uni.showToast({
							title: '未识别到二维码',
							icon: 'none', //如果要纯文本，不要icon，将值设为'none'
							duration: 2000, //持续时间为 2秒
							mask: false,
						})
					}
				})
			},
			inputClock() {
				uni.navigateTo({
					url: '/pages/afterSaleVue/inputClock/inputClock'
				});
			},
			cardReplacement() {
				uni.navigateTo({
					url: '/pages/afterSaleVue/cardReplenishment/cardReplenishment'
				});
			},
			//获取坐标
			getLocation() {
				const _this = this;
				this.amapPlugin = new amap.AMapWX({
					key: this.gaodekey
				});
				uni.showLoading({
					title: '获取信息中'
				});
				// 成功获取位置
				_this.amapPlugin.getRegeo({
					success: (data) => {
						console.log(data, '当前定位');

						_this.address =
							`${data[0].regeocodeData.addressComponent.city}${data[0].regeocodeData.addressComponent.district}`;

						// _this.address 可根据自己的实际情况修改
						_this.address = `${data[0].regeocodeData.formatted_address}`;
						// 传出
						_this.$emit("lodAddress", _this.address)
						uni.hideLoading();
						this.ama = data
					},
					// 获取位置失败
					fail: (err) => {
						uni.showToast({
							title: "获取位置失败，请重启小程序",
							icon: "error"
						})
					}
				});
			},
		},
	}
</script>

<style>
	.list_top_title {
		margin-left: 3%;
		margin-top: 5%;
	}

	.red {
		color: red;
	}

	.list_top_font {
		font-family: 'Courier New', Courier, monospace;
		font-size: 20px;
	}

	.list_input {
		width: 200px;
		height: 30px;
		margin-top: -25px;
		margin-left: 35%;
		border: 1px solid rgba(0, 0, 0, 0.1);
	}

	.view-biankuang {
		width: 250rpx;
		height: 100rpx;
		display: flex;
		margin-top: 50rpx;
		flex: auto;
		align-items: center;
		margin-left: 15%;
		/* margin-top: 150px; */
		/* justify-content: center; */
		/* border-radius: 50%;	 */
		border: 3rpx solid #00AAFF;
		/* //从左往右渐变 */
		background: linear-gradient(to right, #00AAFF, pink);
	}

	.view-biankuang5 {
		width: 250rpx;
		height: 100rpx;
		display: flex;
		margin-top: -100rpx;
		flex: auto;
		align-items: center;
		margin-left: 50%;
		/* margin-top: 150px; */
		justify-content: center;
		/* border-radius: 50%;	 */
		border: 3rpx solid #00AAFF;
		//从左往右渐变
		background: linear-gradient(to right, #00AAFF, pink);
	}

	.view-biankuang2 {
		width: 300rpx;
		height: 100rpx;
		display: flex;
		margin-top: 20rpx;
		flex: auto;
		align-items: center;
		margin-left: 30%;
		margin-top: 150px;
		justify-content: center;
		border: 3rpx solid #00AAFF;
		//从左往右渐变
		background: linear-gradient(to right, #00AAFF, pink);
	}
</style>